<template>
  <div>
    <input type="text" v-model="val1" />
    <select name="" id="" v-model="select">
      <option value="+">加</option>
      <option value="-">减</option>
      <option value="*">乘</option>
      <option value="/">除</option>
    </select>
    <input type="text" v-model="val2" />
    <button @click="btnRetult">=</button>
    <span>您计算的结果是 {{ relut | valfil }}</span>
  </div>
</template>
<script>
export default {
  data() {
    return {
      val1: 0,
      val2: 0,
      relut: 0,
      select: "+",
    };
  },
  methods: {
    btnRetult() {
      // 点击等于号出发的事件
      switch (this.select) {
        case "+":
          // this.val1*1 做隐形转换，把字符串转换成数字
          this.relut = this.val1 * 1 + this.val2 * 1;
          break;
        case "-":
          // this.val1*1 做隐形转换，把字符串转换成数字
          this.relut = this.val1 * 1 - this.val2 * 1;
          break;
        case "*":
          // this.val1*1 做隐形转换，把字符串转换成数字
          this.relut = this.val1 * 1 * this.val2 * 1;
          break;
        default:
          this.relut = this.val1 * 1 / this.val2 * 1;
      }
    },
  },
};
</script>
<style lang="scss" scoped>
</style>